JS 操作样式 |

给 DOM 元素添加指定的属性，并为其赋指定的值。

如果这个指定的属性已存在，则仅设置/更改值。

为 DOM 元素添加 class 时，DOM 元素本身的 class 会被覆盖掉。

1	document.getElementById('box').setAttribute('class','className');

对 DOM 元素进行单个样式修改

1	document.getElementById('box').style.backgroundColor = 'orange';

属性名如果含有 '-' ，要去年 '-' ，后一个字母大写。或者用保留 '-' 的写法

1	document.getElementById('box').style['background-color'] = 'orange';

className 属性设置或返回 DOM 元素的 class 属性。

1 2	// 会输出 #box 的所有 class 值 console.log(document.getElementById('box').className)

可以通过为其赋值来增加样式

1	document.getElementById('box').className += ' newClassName';

字符串值前面要加上空格，分个识别

添加类名

1	document.getElementById('box').classList.add('className');

删除类名

1	document.getElementById('box').classList.remove('className');